<template>
	<view>
		<!-- @load="$refs.uReadMore.init()" -->
		<u-parse :html="info" :seletable="true" :lazy-load="true" show-with-animation :tag-style="{
				img: 'display: block;'
			}"></u-parse>
		<!-- <text>{{vuex_userInfo.vips}}</text> -->

		<view class="viparticle_button u-padding-right-30 u-padding-left-30 u-flex ">
			<LoginButton v-if="vuex_userInfo.vips * 1 !== 1" ref="LoginButton" style="width: 100%;">
				<u-button shape="circle" size="default" :ripple="true" type="warning" class="u-flex-1"
					@click="subUserOrder">成为会员</u-button>
			</LoginButton>
			<view v-else-if="vuex_hasLogin && vuex_userInfo.vips * 1 == 1"
				class="buttons u-flex u-padding-left-30 u-padding-right-30">
				<view class="buttons-box u-flex-1 u-flex u-row-around" v-if="vuex_userInfo.start_time || vuex_userInfo.end_time">
					<text class="buttons-box-text">
						会员有效期：{{vuex_userInfo.start_time}} 至 {{vuex_userInfo.end_time}}
					</text>
				</view>
				<view class="buttons-box u-flex-1 u-flex u-row-around" v-else @click="getUserInfo"> 
					<text class="buttons-box-text">
						没有到账？点此刷新
					</text>
				</view>
			</view>
		</view>





	</view>
</template>

<script>
	import LoginButton from '@/components/login-button/index.vue';
	export default {
		data() {
			return {
				info: ''
			};
		},
		onLoad() {
			this.init();
		},
		methods: {
			getUserInfo() {
				if (this.vuex_hasLogin) {
					this.$u.api.getUserInfo({}).then(res => {
						this.$u.vuex('vuex_userInfo', res.info);
					})
				}
			},
			subUserOrder() {
				if (this.vuex_hasLogin) {
					this.$u.api.subUserOrder({}).then(res => {
						if (res.code == 0) {
							return false;
						};
						uni.requestPayment({
							provider: 'wxpay',
							timeStamp: res.info.timeStamp.toString(),
							nonceStr: res.info.nonceStr,
							package: res.info.package,
							signType: res.info.signType,
							paySign: res.info.paySign,
							success: res => {
								// let temp_user = JSON.parse(JSON.stringify(this.vuex_userInfo));
								// temp_user.vips = 1;
								// this.$u.vuex('vuex_userInfo', temp_user);
								uni.requestSubscribeMessage({
									tmplIds: ['TvixJQQB9b0NrP-PUYx1tS_I0Ud6_ZwcBlLWPDMvO34',],
								}) ;
								this.$u.toast('Loading...', 3000);
								setTimeout(() => {
									this.getUserInfo();
								}, 3000)

							},
							fail: err => {
								console.log('fail:' + JSON.stringify(err));
							}
						});
					})
				} else {
					this.$refs.LoginButton.button_click();
				}

			},
			init() {
				this.$u.api.viparticle({}).then(res => {
					this.info = res.info;
				});
			}
		},
		components: {
			LoginButton
		}
	};
</script>

<style lang="scss" scoped>
	.buttons-box-text {
		font-size: 26rpx;
		color: #000000;
		font-weight: 700;
	}

	.buttons-box {
		background-color: rgba(255, 255, 255, .9);
		height: 100rpx;
		box-shadow: 0rpx 0rpx 14rpx 0rpx #999;
		border-radius: 20rpx;
	}

	.buttons {
		position: fixed;
		left: 0rpx;
		bottom: 40rpx;
		width: 750rpx;
	}

	.viparticle_button {
		position: fixed;
		bottom: 35rpx;
		width: 750rpx;
		// height: 98rpx;
	}
</style>
